@import '../variables.scss';

.MatcLoginPage {
  font-size: 14px;
  height: 100vh;
}

.MatcLoginPageReset {
  background: linear-gradient(30deg, $color_danger 0%, $color_danger_hover 100%);
}

.MatcLoginPageDialog {
	position: fixed;
  transform: translateY(-50%) translateX(-240px);
	top:50%;
	left:50%;
}

.MatcLoginPageContainer {
	width: 480px;
	text-align: left;
	background: #fefefe;
	color: #333;
	border-radius: 5px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  overflow: hidden;

    .MatcToolbarTabs.MatcToolbarTabsBig{
        text-align: center;
        padding: 8px;
    }
    
    .MatcToolbarTabs a {
        border-bottom-width: 2px;
        margin: 0px 5px;
        color: $text_color;
    }
    
    .MatcToolbarTabs a:HOVER {
        color: $primary_color;
    }


  .MatcLoginPageForm{

    display: flex;
    gap: 16px;
    flex-direction: column;
    height: 200px;

    .form-group {
      margin-bottom: 0px;
    }

    .MatcErrorLabel {
      margin-bottom: 16px;
    }
  }

  .MatcErrorLabel {
    height: 32px;
    padding: 8px 0px;
    display: block;
  }

  .MatcLoginPageSection{
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .MatcLoginWrapper {
    width: 300%;
    display: flex;
    align-items: stretch;
    transition: all 0.2s;

    &.login {
      transform: translateX(0);
    }

    &.signup {
      transform: translateX(-33.333%);
    }

    &.reset {
      transform: translateX(-66.667%);
    }
  }

  .MatcLoginContent {
    width: 33.3333%;
  }

  .MatcLoginPageSection {
    padding: 40px 40px;
  }

  .MatcLoginCallToAction {
    padding: 0;
  }


}
